import React from "react";
import { Pagination as AntdPagination } from "../../antd/index";
import { NextPageIcon, PrevPageIcon } from "../Svg";
import "./style/index";
// type
import { PaginationProps } from "../../antd/index";
export type { PaginationProps, PaginationConfig } from "../../antd/pagination";

export type ItemRenderType = "page" | "prev" | "next" | "jump-prev" | "jump-next";
export interface Props extends PaginationProps {}

function Pagination(props: Props) {
  const config: {
    [key in ItemRenderType]?: any;
  } = {
    prev: <PrevPageIcon />,
    next: <NextPageIcon />,
    "jump-next": <div>...</div>,
    "jump-prev": <div>...</div>,
  };
  const itemRender: PaginationProps["itemRender"] = (_, type, originalElement) => {
    const types = Object.keys(config) as ItemRenderType[];
    if (types.includes(type)) return config[type];
    return originalElement;
  };
  const paginationProps = {
    itemRender,
    ...props,
  };
  return <AntdPagination {...paginationProps} />;
}

export default Pagination;
